import 'dart:math';

import 'package:caici/global.dart';
import 'package:caici/manager.dart';
import 'package:caici/panel.dart';
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:provider/provider.dart';

void main() {
  WidgetsFlutterBinding.ensureInitialized();
  Provider.debugCheckInvalidValueType = null;

  runApp(
    MultiProvider(
      child: MyApp(),
      providers: [
        ChangeNotifierProvider<MainState>(
          create: (_) => MainState()..init(),
        ),
      ],
    ),
  );
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      title: '快玩猜词',
      home: MyHomePage(),
    );
  }
}

class MyHomePage extends StatefulWidget {
  MyHomePage({Key key}) : super(key: key);
  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  @override
  void initState() {
    SystemChrome.setSystemUIOverlayStyle(SystemUiOverlayStyle.light);
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Container(
        width: MediaQuery.of(context).size.width,
        height: MediaQuery.of(context).size.height,
        padding: EdgeInsets.only(top: Global.padding.top + 10),
        decoration: BoxDecoration(
          image: DecorationImage(
            image: AssetImage('assets/images/bg.jpg'),
            repeat: ImageRepeat.repeat,
            fit: BoxFit.cover,
          ),
        ),
        child: Column(
          children: [
            Container(
              width: 120,
              height: 70,
              decoration: BoxDecoration(
                image: DecorationImage(
                  image: AssetImage('assets/images/title.png'),
                  repeat: ImageRepeat.repeat,
                  fit: BoxFit.cover,
                ),
              ),
              child: Column(
                mainAxisAlignment: MainAxisAlignment.end,
                crossAxisAlignment: CrossAxisAlignment.center,
                children: [
                  Text(
                    '请选择题库',
                    style: TextStyle(
                      color: Color(0xFFC6C6C6),
                      fontSize: 20,
                      fontWeight: FontWeight.w700,
                    ),
                  ),
                  SizedBox(height: 12),
                ],
              ),
            ),
            SizedBox(height: 20),
            Wrap(
              children: [
                TypeCard(index: 0),
                TypeCard(index: 1),
                TypeCard(index: 2),
                TypeCard(index: 3),
                TypeCard(index: 4),
                TypeCard(index: 5),
              ],
            ),
            InkWell(
              onTap: () {
                showDialog(
                  context: context,
                  builder: (context) {
                    return AlertDialog(
                      elevation: 0,
                      contentPadding: EdgeInsets.all(20),
                      content: Container(
                        height: 130,
                        child: Column(
                          mainAxisAlignment: MainAxisAlignment.start,
                          crossAxisAlignment: CrossAxisAlignment.start,
                          children: [
                            Text(
                              '1：选择题库开始游戏',
                              style: TextStyle(
                                fontSize: 17,
                                fontWeight: FontWeight.w600,
                              ),
                            ),
                            SizedBox(height: 10),
                            Text(
                              '2：左右滑动文字切换上下题',
                              style: TextStyle(
                                fontSize: 17,
                                fontWeight: FontWeight.w600,
                              ),
                            ),
                            SizedBox(height: 10),
                            Text(
                              '3：答对题目双击文字进行标记',
                              style: TextStyle(
                                fontSize: 17,
                                fontWeight: FontWeight.w600,
                              ),
                            ),
                            SizedBox(height: 10),
                            Text(
                              '4：时间到自动结束游戏并计分',
                              style: TextStyle(
                                fontSize: 17,
                                fontWeight: FontWeight.w600,
                              ),
                            ),
                          ],
                        ),
                      ),
                      shape: RoundedRectangleBorder(
                          borderRadius: BorderRadius.circular(5)),
                    );
                  },
                );
              },
              child: Container(
                width: 200,
                height: 45,
                decoration: BoxDecoration(
                  image: DecorationImage(
                    image: AssetImage('assets/images/jc.png'),
                    repeat: ImageRepeat.noRepeat,
                    fit: BoxFit.fitWidth,
                  ),
                ),
              ),
            )
          ],
        ),
      ),
    );
  }
}

class TypeCard extends StatefulWidget {
  TypeCard({Key key, this.index}) : super(key: key);
  final int index;
  @override
  _TypeCardState createState() => _TypeCardState();
}

class _TypeCardState extends State<TypeCard> {
  @override
  void initState() {
    super.initState();
  }

  List<String> randomWords(words) {
    var cloneList = words.map((item) => item).toList();
    List<String> newList = [];
    while (cloneList.length > 0) {
      int index = Random().nextInt(cloneList.length);
      newList.add(cloneList[index]);
      cloneList.removeAt(index);
    }
    return newList;
  }

  @override
  Widget build(BuildContext context) {
    return InkWell(
      onTap: () {
        Navigator.push(
          context,
          MaterialPageRoute(
            builder: (context) => PanelPage(
              words: randomWords(Global.words[widget.index]['words']),
              seconds: 120,
            ),
          ),
        );
      },
      child: Container(
        width: 180,
        height: 160,
        decoration: BoxDecoration(
          image: DecorationImage(
            image: AssetImage('assets/images/card.png'),
            repeat: ImageRepeat.repeat,
            fit: BoxFit.cover,
          ),
        ),
        child: Column(
          mainAxisAlignment: MainAxisAlignment.end,
          crossAxisAlignment: CrossAxisAlignment.center,
          children: [
            Text(
              Global.words[widget.index]['typeName'],
              style: TextStyle(
                color: Color(0xFF482B0C),
                fontSize: 25,
                fontWeight: FontWeight.w700,
              ),
            ),
            SizedBox(height: 39),
          ],
        ),
      ),
    );
  }
}
